/**
 * Created by 银信数据科技 on 2018/2/27.
 */
import React from 'react';
import PropTypes from 'prop-types';//类型检查
import {Table, Popconfirm, Button } from 'antd';
const ProductList = ({ onDelete, onChange ,products }) => { //调用模块时传入的对象
  const columns = [{
    title:'Name',
    dataIndex:'name',
    key:'name'
  }, {
    title:'Actions',
    dataIndex:'action',
    key:'actions',
    render: (text , record) => {//text代表action绑定的text  位置recod代表poducts循环出来的每一条数据
      return (
        <Popconfirm title="Delete?" onConfirm={() => onDelete(record.id)}>
          <Button>Delete</Button>
        </Popconfirm>
      )
    }
  },{
    title:'Id',
    dataIndex:'id',
  },{
    title:'change',
    dataIndex:'change',
    render:(text , record)=>{//自定义事件尝试
      return (
        <Popconfirm title="修改？" onConfirm={() => onChange(record)}>
          <Button>修改</Button>
        </Popconfirm>
      )
    }
  }];
  return (
    <Table
    dataSource={products}
    columns={columns}
    rowKey="id"
    />
  );
};
ProductList.propTypes = {
  onDelete: PropTypes.func.isRequired,
  products: PropTypes.array.isRequired
}
export default ProductList
